<template>
	<div class="wrap">
		<div class="title">
			<p>我的积分</p>
		</div>
		<div class="dangqian">
			<p class="dqjf">当前积分:</p>
			<p class="twofour">&nbsp;240分</p>
		</div>
		<div class="container">
			<div class="data">
				<p>积分日期</p>
				<p>变动</p>
				<p>来源</p>
			</div>
			<router-link to="jifen02">
				<div v-for="price in 7" class="xiangqiang">
				<p class="year">2017 12 30 18:00:00</p>
				<p class="price">+100</p>
				<p class="zengsong">消费赠送 </p>
			</div>
			</router-link>
		</div>
	</div>
</template>

<script>
	
	export default{
		components:{
			
		},
		methods:{
			jifen:function(){
				
			}
		},
		mounted:function(){
			this.jifen();
		}
	}
</script>

<style scoped="scoped">
	.wrap {
		width: 1085px;
		float: left;
		height: 625px;
		margin-left: 20px;
		border: 1px solid #e7e7e7;
		margin-bottom: 40px;
	}
	.title{
		width: 1085px;
		height: 46px;
		border-bottom: 1px solid #E7E7E7;
	}
	.title p{
		font-size: 18px;
		margin-left: 21px;
		line-height: 46px;
	}
	.dangqian{
		width: 1085px;
		height: 46px;
		margin: 0 auto;
	}
	.dangqian p{
		float: left;
		font-size: 16px;
	}
	.dqjf{
		margin-left: 21px;
		line-height: 46px;
	}
	.twofour{
		line-height: 46px;
		color: #F08200;
	}
	.container{
		width: 1046px;
		height: 414px;
		border: 1px solid #E5E5E5;
		border-bottom: none;
		margin: 0 auto;
	}
	.data{
		width: 1044px;
		height: 46px;
		background: #f2f2f2;
		display: flex;
		justify-content: space-around;
	}
	.data{
		line-height: 46px;
		font-size: 16px;
	}
	.xiangqiang{
		width: 1044px;
		height: 51px;
		border-bottom: 1px solid #E7E7E7;
	}
	.xiangqiang p{
		font-size: 16px;
		float: left;
		line-height: 51px;
		}
	.year{
		margin-left: 120px;
	}
	.price{
		margin-left: 250px;
	}
	.zengsong{
		margin-left: 290px;
	}
</style>